$(document).ready(function() {
/*---------------------------------------------------------------------------------------*/
    
    /* for zooming image in the left bar */
    $('.jqzoom').jqzoom({
        zoomType: 'drag',
        lens:true,
        preloadImages: false
    });
/*---------------------------------------------------------------------------------------*/
    $(".getImage").live("click", function(){
	$(".getImage").each(function(){
	    $(this).removeClass("active");
	});
	cabinetID = $(this).attr("data-cabinet-id");
	action = "showCabinetInRight";
	    $(this).addClass("active");
	$.post("/ajax/action",{action:action,cabinetID:cabinetID},function(e){
	    if(e!="Empty"){
		$("#showTheCabinet").html(e);
		equalDiv();
	    }else{
		$("#showTheCabinet").html("<center>No cabinet was created.</center>");
	    }
	});
		
    }).css('cursor','pointer');
    /* View Images by clicking the menu in the left bar */
    $(".viewImage").live("click",function(){
	
	var Image = $(this).attr("src");
	var fileID = $(this).attr("data-image-id");
	
	$("#pic").attr("src",Image);
	imgLoc = $(this).attr("src");
	id = $(this).attr("data-image-id");
	$.post("/ajax/load",{id:id,imgLoc:imgLoc},function(data){
	    $(".picLarge").html(data)
	})
	$(".picLarge").css("background-image", 'url("'+ Image +'")');
	$(".picLarge").attr("rel",fileID);
	$(".bottom_content").css("display","none")
        
    }).css('cursor','pointer');
    
    $(".gen_rep").live("click",function(){
	fileID = $(".picLarge").attr("rel");
	action = $(this).attr("data-tag-action");
	if(action=="generateAllTag"){
	    fileID = $(".picLarge").attr("rel");
	}else{
	    fileID = $(this).attr("rel");
	}
	window.open('/ajax/gen_rep?id='+fileID+'&action='+action+'','','width=750,height=500');
    })
/*---------------------------------------------------------------------------------------*/    
    /* Make Equal Height of Right and Left Column */
    var leftHeight = $(".leftside").height();
    var rightHeight = $(".rightside").height();
    if (leftHeight >= rightHeight){ $(".rightside").height(leftHeight)}
    else{ $(".leftside").height(rightHeight)};
    
/*---------------------------------------------------------------------------------------*/   
    /* Upload image to the database.. */
    $('#upload').live('click', function(){ 
        $("#preview").html('');
        $("#preview").html('<img src="/images/loader/loader.gif" alt="Uploading...."/>');
        $("#imageform").ajaxForm({
        target: '#preview'
        }).submit();
    });
    
    // Call Existing Cabinet
    $(".existingCabinet").live("click", function(){
	action = "existingCabinet";
	$.post("/ajax/action",{action:action}, function(e){
	    if(e=="No Cabinet."){
	    //alert("No existing cabinet.");
		showNotification({
			message: "No existing cabinet.",
			type: "warning",
			autoClose: true,
			duration: 5
		    });
	    }else{
		$(".showCabinet").html(e);
		$(".plus").hide();
		$(".minus").show();
	    }
	    
	});
    });
    
    // Crete new cabinet
    $(".createCabinet").live("click", function(){
	action = "createCabinet";
	$.post("/ajax/action", {action:action}, function(e){
	    $(".showCabinet").html(e);
	    $(".plus").show();
	    $(".minus").hide();
	});
    });
    
    // get the image list of the selected cabinet
    $(".chooseCabinet").live("click", function(){
	cabinetName = $(this).attr("data-cabinet-name");
	actionAttr = $(this).attr("data-cabinet-action");
	$(".imageSortable").children().remove();
	$(".config").children().remove();
	$(".imageConfigurable").children().remove();
	$(".imageloader").show();
	$.post("/ajax/cabinetImageList", {action:actionAttr,cabinetName:cabinetName}, function(e){
	    if(actionAttr=="chooseCabinet"){
		$(".cabinetListImages").html(e);
		$(".imageloader").hide();
	    }else{
		$(".imageList").html(e); // Show list of image according to the cabinet name
		$(".imageloader").hide(); // hide loader
		$(".cabinetName").html(cabinetName); // Give a name to the image list holder
		$(".saveCabinet").attr("data-cabinet-name",cabinetName); // Add the cabinet name to the save button
		
	    }
	});
    });
    
		   
/*---------------------------------------------------------------------------------------*/
// User Maintenance
    
    // Search Users
    $("#search_user").keyup(function(){
	valueSearch = $(this).val();
	page = 1;
	action = "userSearch";
	$.post("/ajax/userMaintenance", { action:action,Name:valueSearch,page:page} , function(e){
	   $("#load_user").html(e);
	});
    });
    $(".editUser").live("click",function(){
    ID = $(this).attr("rel"); // ID of the user
    
    //Hide Label 
    $("#username_"+ID).hide();
    $("#Firstname_"+ID).hide();
    $("#Lastname_"+ID).hide();
        //hide button
        $("#edit_"+ID).hide();
        $("#editDel_"+ID).hide();
    //Show Textfield
    $("#editUsername_"+ID).show();
    $("#editFirstname_"+ID).show();
    $("#editLastname_"+ID).show();
        //Show Save Button
        $("#save_"+ID).show();
    });
    // Click to save edited user
    $(".saveUser").live("click",function(){
	ID = $(this).attr("rel");
	//Saving to Database
	username = $("#editUsername_"+ID).val();
	firstname = $("#editFirstname_"+ID).val();
	lastname = $("#editLastname_"+ID).val();
	//alert(userlevel_text)
	//alert("id: "+ID+"\nusername: "+username+"\nfirstname: "+firstname+"\nlastname: "+lastname+"\nuserlevel: "+userlevel);
	$.post("/ajax/userMaintenance/",{action:"editUser",ID:ID,username:username,firstname:firstname,lastname:lastname},function(data){
	    if(data!="1"){
		alert(data)
	    }else{
		$("#username_"+ID).html(username);
		$("#Firstname_"+ID).html(firstname);
		$("#Lastname_"+ID).html(lastname);
		//Show Label 
		$("#username_"+ID).show();
		$("#Firstname_"+ID).show();
		$("#Lastname_"+ID).show();
		    //hide button
		    $("#edit_"+ID).show();
		    $("#editDel_"+ID).show();
		//Hide Textfield
		$("#editUsername_"+ID).hide();
		$("#editFirstname_"+ID).hide();
		$("#editLastname_"+ID).hide();
		$("#editLOA_"+ID).hide();
		    //Show Save Button
		    $("#save_"+ID).hide();
		$(".user p.username").html(firstname + " " + lastname);
	    }
	})
    });
    /* Delete Checked Checkbox Records from the database in the data table of Users */
    $("#deleteuser").live("click", function(){
        ID_listed = $("#documentListID").val(); // ID List from the checked box 
        action = "DeleteUser";
        
        if(ID_listed==""){
            //Show Notification error
            showNotification({
                message: "Please select a user to proceed!",
                type: "error",
                autoClose: true,
                duration: 5
            });
        }else{
            con = "Are you sure do you want to delete those user's?";
            if(confirm(con)){
                $.post("/ajax/action/",{action:action,ID_listed:ID_listed}, function(e){
                    showNotification({
                        message: "Selected user's was successfully deleted.",
                        type: "success",
                        autoClose: true,
                        duration: 5
                    });
                    setTimeout(function(){  
                        window.location.reload("admin/");
                    }, 500);
                });
                
            }
        }
        
    });
    /* Single Check of the checkbox for deleting the record from the database in data table */
    $(".singleSelectAll").live("click",function(){
	if(this.checked){
            // Select Single Checkbox
            var list = $(':checkbox[name="singleSelectAll[]"]:checked').map(function(){
            return $(this).attr("rel"); // Get an ID of the document
            }).get().join(',');
            $("#documentListID").val(list); // Where the ID input in the textbox
        }else{
            // Remove Unchecked ID in the textbox
            var list = $(':checkbox[name="singleSelectAll[]"]:checked').map(function(){
            return $(this).attr("rel");
            }).get().join(',');
            $("#documentListID").val(list);
        }
    });
    
    /* Delete Checked Checkbox Records from the database in the data table */
    $("#deleteAll").live("click", function(){
        ID_list = $("#documentListID").val(); // ID List from the checked box 
        
        deleteAttr = $(this).attr("rel");
        if(ID_list==""){
            //Show Notification error
            showNotification({
                message: "Please select a file to proceed!",
                type: "error",
                autoClose: true,
                duration: 5
            });
        }else{
            if(deleteAttr=="deleteFolder"){
                action = "DeleteFolder";
                ID_listed = $("#documentListID").val();
                con = "Are you sure do you want to delete selected folder?";
                if(confirm(con)){
                    $.post("/ajax/actions/",{action:action,ID_listed:ID_listed}, function(e){
                        if(e=="Folder was successfully deleted."){
                            showNotification({
                                message: "Only folder's with an empty contents of file's was deleted. Folder's with files was not deleted.",
                                type: "success",
                                autoClose: true,
                                duration: 5
                            });
                            setTimeout(function(){  
                                window.location.reload("create_folder/");
                            }, 1000);
                        }else{
                            showNotification({
                                message: "Folder's with contents are not availble to delete.",
                                type: "error",
                                autoClose: true,
                                duration: 5
                            });
                        }
                    });
                    
                }
            }else{
                if(deleteAttr=="deleteDocument"){
                    action = "DeleteDocument";
                    con = "Are you sure do you want to delete the selected file?";
                    if(confirm(con)){
                        $.post("/ajax/actions/",{action:action,ID_list:ID_list}, function(e){
                            showNotification({
                                message: "Selected file's was successfully deleted.",
                                type: "success",
                                autoClose: true,
                                duration: 5
                            });
                            setTimeout(function(){  
                                window.location.reload("home/");
                            }, 500);
                        });
                        
                    }
                }
            }
            
        }
        
    });
    
    /* Select All the checkbox in sinlge checked of the header Checkbox */
    $(".selectAll").live("click",function(){
        if(this.checked){
            $(".singleSelectAll").each(function(){
                $(this).attr("checked",true);
                var list = $(':checkbox[name="singleSelectAll[]"]:checked').map(function(){
                return $(this).attr("rel");
                }).get().join(',');
                $("#documentListID").val(list);
            });
        }else{
            $(".singleSelectAll").each(function(){
                $(this).attr("checked",false);
                var list = $(':checkbox[name="singleSelectAll[]"]:checked').map(function(){
                return $(this).attr("rel");
                }).get().join(',');
                $("#documentListID").val(list);
            });
        }
    });
    /* Edit User by clicking the edit icon */
    $(".edit_users").live("click", function(){
        ID = $(this).attr("id"); // User ID
        action = "getPassword";
        /* Records from the selected */
        uFname = $("#uFname_"+ID).text();
        uLname = $("#uLname_"+ID).text();
        uType = $("#uType_"+ID).attr("rel");
        uUname = $("#uUname_"+ID).text();
        uDateReg = $("#uDateReg_"+ID).text();
        uActive = $("#uActive_"+ID).attr("rel");
	uUserLocation= $("#uUserLocation_"+ID).text();
	uUserDept = $("#uUserDept_"+ID).text();
        /* Show selected records in the fields */
        $("#userFname").val(uFname);
        $("#userUname").val(uUname);
	
        //userUtype = $("#userUtype").val(uType);
        $("#userUtype").find("option[id=" + uType + "]").attr("selected", true);
        $("#userUactive").find("option[id=" + uActive + "]").attr("selected", true);
        $("#userDivSec").find("option[id=" + uUserDept + "]").attr("selected", true);
	$("#userLocation").val(uUserLocation);
	
        $(".updateUser").attr("id",ID); // Give ID to the button
	$(".updateUser").show();
        $(".users").hide(); //hide button
        $("#userLname").val(uLname);
        
        $(".userEditForm").show(); // Show form fields in edit
        // Hide Password
        $("#userPassword").hide(); // Password Field
        $("#lbluserPassword").hide(); // Label
    });
    
    //Hide add user form
    $("#hideForm").live("click",function(){
	//Set back to top when user click the hide button
	$('html, body').animate({
	    scrollTop: $("body").offset().top
	});
	$("#addUser").hide().fadeOut(); // hide user Forms
	
    });
    /* Show User form */
    $(".addUserbtn").live("click", function(){
        $(".userEditForm").show();
        // Show Password
        $("#userPassword").show(); // Password Field
        $("#lbluserPassword").show(); // Label
        $(".field").val(null);
        $(".updateUser").hide();
	$(".users").show();
    });
    /* Update Users from the database */
    $(".updateUser").live("click",function(){
        ID = $(this).attr("id");    
        userFname = $("#userFname").val();
        userUname = $("#userUname").val();
        userLname = $("#userLname").val();
        userUtype = $("#userUtype option:selected").attr("id");
            userUtype_txt = $("#userUtype option:selected").text();
        userActive = $("#userUactive option:selected").attr("rel");
            userActive_txt = $("#userUactive option:selected").text();
        userPassword = $("#userPassword").val();
	uUserDept = $("#userDivSec option:selected").text();
	uUserLocation = $("#userLocation").val();
        action = "editUser";
        if(userFname==""||userUname==""||userLname==""||userUtype==""||userActive==""||uUserDept==""||uUserLocation==""){
            showNotification({
                message: "Please dont leave blank on the fields while your editing their information.",
                type: "error",
                autoClose: true,
                duration: 5
            });
        }else{
            $.post("/ajax/action/", {action:action,ID:ID,userFname:userFname,userUname:userUname,userLname:userLname,
                   userUtype:userUtype,userActive:userActive,userDept:uUserDept,uUserLocation:uUserLocation}, function(){
                showNotification({
                    message: "User was successfully edited.",
                    type: "success",
                    autoClose: true,
                    duration: 5
                });
                $("#uFname_"+ID).text(userFname);
                $("#uLname_"+ID).text(userLname);
                $("#uType_"+ID).text(userUtype_txt);
                $("#uUserDept_"+ID).text(uUserDept);
                $("#uUname_"+ID).text(userUname);
		$("#uUserLocation_"+ID).text(uUserLocation);
                $("#uActive_"+ID).html("<center>"+userActive_txt+"</center>");
            });
        }
        //alert(userFname+"\n"+userUname+"\n"+userLname+"\n"+userPassword+"\n"+userUtype+"\n"+userActive+"\n"+userDept)
    });
    /* Add User to the database */
    $(".users").live("click",function(){
        userFname = $("#userFname").val();
        userUname = $("#userUname").val();
        userLname = $("#userLname").val();
        userUtype = $("#userUtype option:selected").attr("id");
        userActive = $("#userUactive option:selected").attr("rel");
        userDept = $("#userDept option:selected").attr("id");
        userPassword = $("#userPassword").val();
        action = "addNewUser";
        if(userFname==""||userUname==""||userLname==""||userPassword==""){
            showNotification({
                message: "Please dont leave blank on those fields.",
                type: "error",
                autoClose: true,
                duration: 5
            });
        }else{
            $.post("/ajax/action/", {action:action,userFname:userFname,userUname:userUname,userLname:userLname,
                   userUtype:userUtype,userActive:userActive,userDept:userDept,userPassword:userPassword}, function(){
                showNotification({
                    message: "User was successfully created.",
                    type: "success",
                    autoClose: true,
                    duration: 5
                });
                setTimeout(function(){  
                    window.location.reload("admin/");
                }, 500);
            });
        }
        //alert(userFname+"\n"+userUname+"\n"+userLname+"\n"+userPassword+"\n"+userUtype+"\n"+userActive+"\n"+userDept)
    });
    
    // Add User to the database
    $(".saveNewUser").live("click",function(){
	username = $("#newUsername").val();
	firstname = $("#newFirstname").val();
	lastname = $("#newLastname").val();
	loa = $("#newLOA").val();
	password = $("#newPassword").val();
	action = "addUser";
	dataString = 'action=' + action + '&username=' + username + '&firstname=' + firstname +
	'&lastname=' + lastname + '&loa=' + loa + '&password=' + password;
	//Save to the database.
	$.ajax({
	    type: "POST",
	    url: "/ajax/userMaintenance/",
	    data: dataString,
	    success: function(data)
	    {
		//Notification if user is wrong or correct
		if(data=="New user was successfully saved."){
		    $(".correctNotification").show();
		    $("#correct").html(data);
		    setTimeout(function(){  
			$("body").load("/user_maintenance/").fadeIn('fast');
		    }, 2000);
		}else{
		    //alert(data)
		    if(data=="Please fill those required fields."){
			$(".wrongNotification").show();
			$("#wrong").html(data);
			$(".wrongNotification").show().fadeOut(3000);
		    }else{
			if(data=="Please input the correct format for your name."){
			    $(".wrongNotification").show();
			    $("#wrong").html(data);
			    $(".wrongNotification").show().fadeOut(3000);
			}else{
			    if(data=="Username is already taken."){
				$(".wrongNotification").show();
				$("#wrong").html(data);
				$(".wrongNotification").show().fadeOut(3000);
			    }
			}
		    }
		}
	    }
	});
	
    });
/*---------------------------------------------------------------------------------------*/
    $("#search_audit").live("keyup", function(){
	Name = $(this).val();
	action = "searchAudit";
	page = 1;
	$.post("/ajax/audit_trail", {Name:Name,action:action,page:page}, function(e){
	    $(".showAuditTrail").html(e);
	});
    });
/*---------------------------------------------------------------------------------------*/
// User Profile Edit
    /* Edit information */
    $("#editInformation").live('click', function(){
        userID = $(this).attr("data-user-id");
	$(this).hide();
	$(".userBasicInfo_"+userID).hide();
	$(".showUserBasicInfo_"+userID).show();
	$(".levelHide").hide();
    });
    /* Click saving information button */
    $("#saveInformation").live('click', function(){
        action = "editInformation";
	userID = $(this).attr("data-user-id");
	firstname = $("#firstname").val();
	lastname = $("#lastname").val();
	division = $("#division option:selected").text();
	locationuser = $("#location").val();
	$.post("/ajax/action", $(".basicInfo").serialize() + "&action=" + action + "&userID=" + userID, function(e){
	    if(e=="Please dont leave those blank field's."){
		alert("Please dont leave those blank field's.");
	    }else{
		alert("Info was successfully  updated.");
		$(".userBasicInfo_"+userID).show();
		$(".showUserBasicInfo_"+userID).hide();
		$("#editFirstname").html(firstname);
		$("#editLastname").html(lastname);
		$("#editDivision").html(division);
		$("#editLocation").html(locationuser);
		$(".levelHide").show();
		/* Change Value to the sidebar */
		    $(".user p.username").html(firstname + " " + lastname);
	    }
	});
    });
    /* Changing Username of the user */
    $(".changeUsername").live("click", function(){
        newUsername = $("#newUsername").val(); // new username
        action = "newUsername";
        if(newUsername==""){
            showNotification({
                message: "Please input your new username.",
                type: "error",
                autoClose: true,
                duration: 5
            });
        }else{
            $.post("/ajax/action/",{action:action,newUsername:newUsername}, function(e){
                showNotification({
                    message: "You username was successfully changed.",
                    type: "success",
                    autoClose: true,
                    duration: 5
                });
                $("#oldUsername").val(newUsername); // change the value of the old user to a new one
		$("#newUsername").val(null);
            });
        }
    });
    /* Changing password of the user */
    $(".changePassword").live("click", function(){
        oldPassword = $("#oldPassword").val();
        newPassword = $("#newPassword").val();
        retypePassword = $("#retypePassword").val();
        action = "newPassword";
        if(oldPassword=="" || newPassword==""|| retypePassword==""){
            showNotification({
                message: "Please fill those required fields.",
                type: "error",
                autoClose: true,
                duration: 2
            });
        }else{
            if(newPassword!=retypePassword){
                showNotification({
                    message: "Your new password and retype password is not the same.",
                    type: "error",
                    autoClose: true,
                    duration: 2
                });
            }else{
                $.post("/ajax/action/",{action:action,newPassword:newPassword,oldPassword:oldPassword}, function(e){
                    if(e=="no"){
                        showNotification({
                            message: "Your Old password does'nt match in our records.",
                            type: "error",
                            autoClose: true,
                            duration: 2
                        });
                    }else{
                        showNotification({
                            message: "Your password was successfully changed.",
                            type: "success",
                            autoClose: true,
                            duration: 2
                        });
			$("#oldPassword").val(null);
			$("#newPassword").val(null);
			 $("#retypePassword").val(null);
			 
                    }
                    
                });
            }
        }
    });
/*---------------------------------------------------------------------------------------*/
    /* Show new image by clicking the label of an available image from the database */
    $(".uploadedImage").live('click', function(){
        var fileLocation = $(this).attr("id");
        var fileID = $(this).attr("rel");
	cabinetName = $(this).attr("data-cabinet-name");
        //window.location="/upload?id="+fileID+"";
	$('.imageTagging').attr('id', fileID);
	height = $('.imageTagging').height();
	$("#"+fileID).attr('src',fileLocation);
	$("#"+fileID).attr('rel', fileID);
	
	$(".imageloader").show(); // Show loading
	$(".imageLoc").html(null); // Remove Value
	// Get Selected Image
	$.post("/ajax/imageList",{fileID:fileID,cabinetName:cabinetName}, function(data){
	    $(".imageLoc").html(data);
	    equalDiv();
	    $('html, body').animate({
	    scrollTop: $(".imageLoc").offset().top
	    }, 1000);
	    $(".imageloader").hide();
	});
	//window.location.replace('upload?id='+fileID+'');
	a=0;  // count reset to 0
	$(".information").remove(); // Remove Fields
    });
    /* By Clicking the button to save the information */
    $("#backTop").click(function(){
        $('body,html').animate({
                scrollTop: top_pos
        }, 1000);
    });
    /* Set ID for Tagging */
    var fileID = $(".imageTagging").attr("rel");
    //$.post("/ajax/ajax", {fileID: fileID} );
    $.post("/ajax/ajax",{'action':'list','fileID': fileID});
    
    // Once a user click the tagged image it shows their information
    $(".tagged").live('click', function(){
        var ID = $(this).attr("id");
        $.ajax({
            type: "POST",
            url: "/ajax/get-information",
            data: 'ID=' + ID,
            success: function(a)
            {
                $("#imageInformation").html(a);
                $('html, body').animate({
                    scrollTop: $("#imageInformation").offset().top
                }, 1000);
            }
        });
	$(".bottom_content").css("display","inline-block")
    });
    // Once a user click the label it shows their information
    $(".Taglabels").live('click', function(){
        var ID = $(this).attr("id");
        $.ajax({
            type: "POST",
            url: "/ajax/get-information",
            data: 'ID=' + ID,
            success: function(a)
            {
                $("#imageInformation").html(a);
                $('html, body').animate({
			    scrollTop: $("#imageInformation").offset().top
			}, 1000);
            }
        });
    });
/*---------------------------------------------------------------------------------------*/
//for searching
    $("#searchRecord").keyup(function(){
	action = "searchTag";
	page = 1;
	value = $(this).val();
	$(".printAll").attr("rel","");
	$.ajax({
	    type: "POST",
	    url: "/ajax/record",
	    data: "Name=" + value + "&action=" + action + "&page=" + page,
	    success: function(data){
		$(".Showsearch").html(data);
		
	    }
	});
    });
    
    // View list of table according to the selected cabinet
    $(".viewCabinetBy").live("change", function(){
	page = 1;
	action = "viewCabinetBy";
	cabinetName = $(".viewCabinetBy option:selected").val();
	$(".printAll").attr("rel","");
	$.post("/ajax/record",{action:action,Name:cabinetName,page:page}, function(e){
	    $(".Showsearch").html(e);
	});
    });
    
    /* Select All the checkbox in sinlge checked of the header Checkbox */
    $(".selectAll").live("click",function(){
        if(this.checked){
            $(".singleSelectAll").each(function(){
                $(this).attr("checked",true);
                var list = $(':checkbox[name="singleSelectAll[]"]:checked').map(function(){
                return $(this).attr("rel");
                }).get().join(',');
                //$(".printAll").val(list);
	    $(".printAll").attr("rel",list);
            });
        }else{
            $(".singleSelectAll").each(function(){
                $(this).attr("checked",false);
                var list = $(':checkbox[name="singleSelectAll[]"]:checked').map(function(){
                return $(this).attr("rel");
                }).get().join(',');
                //$(".printAll").val(list);
	    $(".printAll").attr("rel",list);
            });
        }
    });
    /* Single Check of the checkbox for deleting the record from the database in data table */
    $(".singleSelectAll").live("click",function(){
	if(this.checked){
            // Select Single Checkbox
            var list = $(':checkbox[name="singleSelectAll[]"]:checked').map(function(){
            return $(this).attr("rel"); // Get an ID of the document
            }).get().join(',');
            //$(".printAll").val(list);
	    $(".printAll").attr("rel",list);
        }else{
            // Remove Unchecked ID in the textbox
            var list = $(':checkbox[name="singleSelectAll[]"]:checked').map(function(){
            return $(this).attr("rel");
            }).get().join(',');
            //$(".printAll").val(list);
	    $(".printAll").attr("rel",list);
        }
    });
/*---------------------------------------------------------------------------------------*/  
//Reports
    $(".generateReports").change(function(){
	reportType = $(".generateReports option:selected").text();
	//alert(reportType);
	if(reportType=="Port Assignment"){
	    $("#portAssignment").show();
	    $("#voiceUsers").hide();
	    $("#dataUser").hide();
	}else{
		if(reportType=="Voice Users"){
		    $("#voiceUsers").show();
		    $("#portAssignment").hide();
		    $("#dataUser").hide();
		}else{
		    if(reportType=="Data User"){
			$("#dataUser").show();
			$("#voiceUsers").hide();
			$("#portAssignment").hide();
		    }
		}
	    }
    });
    $(".deleteImages").live("click",function(){
	fileID = $(this).attr("rel");
	action = "deleteThisImage";
	con = "Are you sure do you want to delete this fiel?";
	if(confirm(con)){
	    $.ajax({
		url: "/ajax/action/",
		type: "POST",
		data: "fileID=" + fileID + "&action=" + action,
		success: function(e){
		    //alert("")
		    if(e=="File was successfully deleted"){
			$(".imageLoc").remove();
			//alert("File was successfully deleted.");
			showNotification({
				message: "File was successfully deleted.",
				type: "success",
				autoClose: true,
				duration: 5
			});
			setTimeout(function(){
			    window.location.reload();
			},3000);
		    }
		}
	    });
	}
	
    });
    
    // Show all created cabinet
    $("#listCabinet").live("click", function(){
	$(".navLink").each(function(){
	    $(this).removeClass("active");
	});
	$(this).addClass("active");
	$(".loaderMenu").show();
	setTimeout(function(){
	    $("#allCabinet").each(function(){
		$(this).show().slideDown();
		equalDiv();
		$(".loaderMenu").hide();
	    });
	},1000);
    });
/* -------------------------------------------------------------------------------------------------------- */
// Upload

    //Start Tagging Add class tag on images
    $(".startTag").live("click", function(){
	tagID = $(this).attr("data-tag-id"); // Tag Information ID
	imageID = $(this).attr("data-image-id"); // Image ID
	$(".imageTag").addClass("tag"); // Adding tag class on the selected images
	$(this).hide();
	$(".cancelstartTag").show();
	
	$("#taggedAction_"+imageID).children().remove();
	a=0;  // count reset to 0
	$(".TagDrag_"+imageID).draggable( 'disable' ).css("cursor","crosshair");
	$(".TagDrag_"+imageID).resizable( 'disable' ).css("cursor","crosshair");
	$("#configTag_"+tagID).css("border","2px solid #000");
	$("#configTag_"+tagID).removeAttr("data-a-click");
	
    });
    // Cancel Tagging remove Class on tag images
    $(".cancelstartTag").live("click", function(){
	tagID = $(this).attr("data-tag-id"); // Tag Information ID
	imageID = $(this).attr("data-image-id"); // Image ID
	$(".imageTag").removeClass("tag"); // Remove tag class on the selected images
	$(this).hide();
	$(".startTag").show();
	$("#TaggedImage_"+imageID).remove();
	$("#addinfoTag_"+imageID).remove();
	$("#removeTag_"+imageID).remove();
	$(".imageTag").removeClass("tag"); // Remove tag class on the selected images
	
	$("#taggedAction_"+imageID).children().remove();
	a=0;  // count reset to 0
	$(".TagDrag_"+imageID).draggable( 'disable' ).css("cursor","crosshair");
	$(".TagDrag_"+imageID).resizable( 'disable' ).css("cursor","crosshair");
	$("#configTag_"+tagID).css("border","2px solid #000");
	$("#configTag_"+tagID).removeAttr("data-a-click");
    });
    
    // Determined if has a tag
    $(".imageTag").live("click", function(){
	if(!$(this).hasClass("tag")){
	    //alert("Please click the Start Tagging to allow you create a tag.");
	    showNotification({
                    message: "Please click the Start Tagging to allow you create a tag.",
                    type: "warning",
                    autoClose: true,
                    duration: 5
                });
	}
    });
    
    $(".tag").live("click", function(e){
	height = $(this).height(); // Image Height
	imageTop = e.pageY - 100; // Get Top of the selected image where you want to tagged it.
	imageLeft = e.pageX-50; // Get left of the selected image where you want to tagged it.
	imageID = $(this).attr("data-image-id");
	$("#taggedAction_"+imageID).children().remove(); // Remove  Action of configTag
	// Set Tagged Image
	    $('<div class="TaggedImage" id="TaggedImage_'+imageID+'" style="margin-left: 10px;width:680px; background-color:white;position:absolute;height:'+height+'px;border:1px solid;opacity:0.4;">',
	      '</div>').insertAfter(this);
	    
	    // Set where you want to tagged the selected images
	    $('#TaggedImage_'+imageID).append('<div class="TagDrag" id="TagDrag_'+imageID+'" data-image-id="'+imageID+'" style="top:0px;left:0px;width:40px;position:absolute;height:40px;border:3px solid #000;opacity:1;">',
	      '</div>');
	    // Resize and Drag the created tag
	    $("#TagDrag_"+imageID).draggable({ containment: "#TaggedImage_"+imageID, scroll: false }).css("cursor","crosshair");
	    $("#TagDrag_"+imageID).resizable({ containment: "#TaggedImage_"+imageID, scroll: false }).css("cursor","crosshair");
	    
	    // Insert an Action 
	    $("#taggedAction_"+imageID).append("<img src='/images/icon/plus.png' class='addinfoTag cursor' id='addinfoTag_"+imageID+"' data-image-id='"+imageID+"' Title='Add Information to the created tag.' style='margin-right:10px;'/>",
					       "<img src='/images/icon/delete.png' class='removeTag cursor' id='removeTag_"+imageID+"' data-image-id='"+imageID+"' Title='Remove tag created.' style='margin-right:10px;'/>"
					       );
	    
	$(".configTag").removeClass("configTag");
    });
    // Save tagged information in the image to the database
    $(".saveTag").live("click", function(e){
       taggedWidth = $(".TagDrag").width(); // Get width of created tag
       taggedHeight = $(".TagDrag").height(); // Get height of created tag
       taggedTop = $(".TagDrag").css('top'); // Get Top position of the created tag
       taggedLeft = $(".TagDrag").css('left'); // Get Left position of the created tag
       imageID = $(this).attr("data-image-id"); // Image ID
       statusBlink = $(".statusBlink option:selected").text();
       cabinetName = $(".imageTag").attr("data-cabinet-name");
       $("#addinfoTag_"+imageID).remove();
       action = "saveTag";
       $.post("/ajax/action",$(".taggingInfo").serialize()+"&cabinetName="+cabinetName+"&action="+action+"&taggedWidth="+taggedWidth+"&taggedHeight="+taggedHeight+"&taggedTop="+taggedTop+"&taggedLeft="+taggedLeft+"&imageID="+imageID, function(tagID){
	  $("<div style='position:absolute;margin-left:10px;'><div class='configTag reconfigTag' id='configTag_"+tagID+"' data-image-id='"+imageID+"' data-tag-id='"+tagID+"' style='border:2px solid #000;opacity:0.4;background-color:"+statusBlink+";cursor:pointer;top:"+taggedTop+";left:"+taggedLeft+";position:absolute;width:"+taggedWidth+"px;height:"+taggedHeight+"px;'></div></div>").insertAfter(".tag");
	  $("#TaggedImage_"+imageID).remove();
	  $("#removeTag_"+imageID).remove();
	  $(".information").remove(); // Remove Fields
	  equalDiv();
	  showNotification({
                    message: "Tag was successfully saved.",
                    type: "success",
                    autoClose: true,
                    duration: 5
                });
       });
    });
    // Update Tagged information in the image to the database
    $(".updateTag").live("click", function(){
	tagID = $(this).attr("data-tag-id"); // Tag Information ID
	imageID = $(this).attr("data-image-id"); // Image ID
	taggedWidth = $("#configTag_"+tagID).width(); // Get width of created tag
	taggedHeight = $("#configTag_"+tagID).height(); // Get height of created tag
	taggedTop = $("#configTag_"+tagID).css('top'); // Get Top position of the created tag
	taggedLeft = $("#configTag_"+tagID).css('left'); // Get Left position of the created tag
	statusBlink = $(".statusBlink option:selected").text();
	action = "updateTag";
	taggingInfo = $(".taggingInfo").serialize();
	cabinetName = $(".imageTag").attr("data-cabinet-name");
	$.post("/ajax/action",taggingInfo+"&cabinetName="+cabinetName+"&action="+action+"&taggedWidth="+taggedWidth+"&taggedHeight="+taggedHeight+"&taggedTop="+taggedTop+"&taggedLeft="+taggedLeft+"&imageID="+imageID+"&tagID="+tagID, function(updateTagID){
	    //$("<div style='position:absolute;margin-left:10px;'><div class='configTag reconfigTag' id='configTag_"+tagID+"' data-image-id='"+imageID+"' data-tag-id='"+tagID+"' style='border:2px solid #000;opacity:0.4;background-color:"+statusBlink+";cursor:pointer;top:"+taggedTop+";left:"+taggedLeft+";position:absolute;width:"+taggedWidth+"px;height:"+taggedHeight+"px;'></div></div>").insertAfter(".tag");
	    $("#configTag_"+tagID).css("background-color",statusBlink);
	    $("#configTag_"+tagID).css("top",taggedTop);
	    $("#configTag_"+tagID).css("left",taggedLeft);
	    $("#configTag_"+tagID).css("width",taggedWidth);
	    $("#configTag_"+tagID).css("height",taggedHeight);
	    $("#TaggedImage_"+imageID).remove();
	    $("#removeTag_"+imageID).remove();
	    $(".information").remove(); // Remove Fields
	    equalDiv();
	    $(".TagDrag_"+imageID).draggable( 'disable' ).css("cursor","crosshair");
	    $(".TagDrag_"+imageID).resizable( 'disable' ).css("cursor","crosshair");
	    $("#configTag_"+tagID).css("border","2px solid #000");
	    $("#configTag_"+tagID).removeAttr("data-a-click");
	    a=0;  // count reset to 0
	    $("#taggedAction_"+imageID).children().remove();
                showNotification({
                    message: "Tag was successfully updated.",
                    type: "success",
                    autoClose: true,
                    duration: 5
                });
	});
	
	//alert("Width:"+ taggedWidth + "\n" + "Height:"+ taggedHeight+"\n" + "Top:" + taggedTop + "\n" + "Left:" + taggedLeft);
	
    });
    // Add information to the selected tag
    $(".addinfoTag").live("click", function(){
	imageID = $(this).attr("data-image-id"); // Image ID
	action = "addinfoTag";
	// get taggingInformation Fields
	$.post("/ajax/taggingInformation",{action:action,imageID:imageID}, function(fields){
	    $("#TaggingInformation").html(fields);
	    equalDiv();
	    //scroll to bottom
	    $('html, body').animate({
		scrollTop: $("#TaggingInformation").offset().top
	    }, 1000);
	});
    });
    // Remove Set Tagged on the image
    $(".removeTag").live("click", function(){
	imageID = $(this).attr("data-image-id");
	$("#TaggedImage_"+imageID).remove();
	$("#addinfoTag_"+imageID).remove();
	$("#removeTag_"+imageID).remove();
	$(".information").remove(); // Remove Fields
	// Cancel Tagging remove Class on tag images
	$(this).hide();
	$(".cancelstartTag").show();
	a=0; // count reset to 0
	//make the left and right an equal height
	var leftHeight = $(".leftside").height();
	var rightHeight = $(".body_content").height();
	if (leftHeight >= rightHeight){ $(".rightside").height(leftHeight)}
	else{ $(".leftside").height(rightHeight)};
	
	$(".reconfigTag").addClass("configTag");
    });
    
    // Config (Edit,delete) the  tagged selected
    a = 0;
    $(".configTag").live("click", function(){
	tagID = $(this).attr("data-tag-id"); // Tag Information ID
	imageID = $(this).attr("data-image-id"); // Image ID
	
	// Add Action when user click the current tag
	if(a==0){
	     $("#taggedAction_"+imageID).append("<img src='/images/icon/edit.png' class='editTag cursor' id='editTag"+tagID+"' data-tag-id='"+tagID+"'  data-image-id='"+imageID+"' Title='Edit' style='margin-right:10px;'/>" ,
					   "<img src='/images/icon/delete.png' class='deleteTag cursor' id='deleteTag"+imageID+"' data-tag-id='"+tagID+"' data-image-id='"+imageID+"' Title='Remove' style='margin-right:10px;'/>",
					 "<img src='/images/icon/stop.png' class='cancelTag cursor' id='cancelTag"+imageID+"' data-tag-id='"+tagID+"' data-image-id='"+imageID+"' Title='Cancel' style='margin-right:10px;'/>"
					 );
	     $("#configTag_"+tagID).css("border","2px solid #fff");
	     $("#configTag_"+tagID).attr("data-a-click",a);
	     
	     
	}
       getA = $("#configTag_"+tagID).attr("data-a-click");
	if(getA!=0){
	    //alert("Please click the icon cancel to allow you edit the other tagged.");
	    showNotification({
                    message: "Please click the icon cancel to allow you edit the other tagged.",
                    type: "warning",
                    autoClose: true,
                    duration: 5
                });
	}
       a++;
       // Add tag id attribute to start and cancel tagging
       $(".startTag").attr("data-tag-id",tagID);
       $(".cancelstartTag").attr("data-tag-id",tagID);
    });
    
    // Delete the selected tag information to remove it from the database
    $(".deleteTag").live("click", function(){
	tagID = $(this).attr("data-tag-id"); // Tag Information ID
	imageID = $(this).attr("data-image-id"); // Image ID
	action = "deleteTag";
	$.post("/ajax/action", {tagID:tagID,imageID:imageID,action:action}, function(tag){
	    if(tag=="Tag Deleted."){
		con = "Are you sure do you want to delete this tag?";
		if(confirm(con)){
		    $("#configTag_"+tagID).remove();
		    $("#taggedAction_"+imageID).children().remove();
		    a=0; // count reset to 0
		    //alert("Selected Tag was successfully deleted.");
		    showNotification({
			message: "Selected Tag was successfully deleted.",
			type: "success",
			autoClose: true,
			duration: 5
		    });
		}
	    }
	});
    });
    
    // Edit the selected tag
    $(".editTag").live("click", function(){
	tagID = $(this).attr("data-tag-id"); // Tag Information ID
	imageID = $(this).attr("data-image-id"); // Image ID
	$("#configTag_"+tagID).addClass("TagDrag_"+imageID);
	$("#configTag_"+tagID).css("border","2px dotted #fff");
	$(".editTag").hide(); // hide if user want to edit the tagged selected
	// Resize and Drag the created tag
	$(".TagDrag_"+imageID).draggable({ containment: "#imageTag_"+imageID, scroll: false }).css("cursor","crosshair");
	$(".TagDrag_"+imageID).resizable({ containment: "#imageTag_"+imageID, scroll: false }).css("cursor","crosshair");
	
	// Get the element of the selected tag
	editWidth = $("#configTag_"+tagID).width();
	editHeight = $("#configTag_"+tagID).height();
	editTop = $("#configTag_"+tagID).css("top");
	editLeft = $("#configTag_"+tagID).css("left");
	
	// Add attribute of the edited tag to the cancel
	$("#cancelTag"+imageID).attr("editWidth",editWidth);
	$("#cancelTag"+imageID).attr("editHeight",editHeight);
	$("#cancelTag"+imageID).attr("editTop",editTop);
	$("#cancelTag"+imageID).attr("editLeft",editLeft);
	//alert("Width:"+ editWidth + "\n" + "Height:"+ editHeight+"\n" + "Top:" + editTop + "\n" + "Left:" + editLeft);
	
	$(".TagDrag_"+imageID).draggable( 'enable' ).css("cursor","crosshair");
	$(".TagDrag_"+imageID).resizable( 'enable' ).css("cursor","crosshair");
	action = "editinfoTag";
	$.post("/ajax/taggingInformation",{action:action,tagID:tagID},function(editFields){
	    $("#TaggingInformation").html(editFields);
	    equalDiv();
	    //scroll to bottom
	    $('html, body').animate({
		scrollTop: $("#TaggingInformation").offset().top
	    }, 1000);
	});
    });
    
    // Cancel the tag selected if user didnt want to edit or remove it
    $(".cancelTag").live("click", function(){
	tagID = $(this).attr("data-tag-id"); // Tag Information ID
	imageID = $(this).attr("data-image-id"); // Image ID
	$("#taggedAction_"+imageID).children().remove();
	a=0;  // count reset to 0
	$(".TagDrag_"+imageID).draggable( 'disable' ).css("cursor","crosshair");
	$(".TagDrag_"+imageID).resizable( 'disable' ).css("cursor","crosshair");
	$("#configTag_"+tagID).css("border","");
	// Get the attribute of the selected tag to back it to the normal
	Cwidth = $(this).attr("editWidth");
	Cheight = $(this).attr("editHeight");
	Ctop = $(this).attr("editTop");
	Cleft = $(this).attr("editLeft");
	//alert("Width:"+ Cwidth + "\n" + "Height:"+ Cheight+"\n" + "Top:" + Ctop + "\n" + "Left:" + Cleft);
	
	$("#configTag_"+tagID).css("width",Cwidth);
	$("#configTag_"+tagID).css("height",Cheight);
	$("#configTag_"+tagID).css("top",Ctop);
	$("#configTag_"+tagID).css("left",Cleft);
	$("#configTag_"+tagID).css("border","2px solid #000");
	
	$(".information").remove(); // Remove Fields
	
	$("#configTag_"+tagID).removeAttr("data-a-click");
	equalDiv();
    });
    
    // Delete List of Cabinet
    $(".deleteCabinet").live("click", function(){
	action = "DeleteCabinet";
	cabinetID = $(this).attr("rel");
	$.post("/ajax/action", {action:action,cabinetID:cabinetID}, function(cabinet){
	    //alert(cabinet)
	});
    });
    // Edit Cabinet
    $(".editCabinet").live("click", function(){
    cabinetName = $(this).attr("data-cabinet-name");
    cabinetID = $(this).attr("rel");
    action = "editCabinetCreated";
    $(".saveCabinet").attr("data-cabinet-name",cabinetName);
	$.post("/ajax/action",{cabinetName:cabinetName,cabinetID:cabinetID,action:action}, function(e){
	    if(e!="Empty"){
		$(".update").html(e);
		$(".imageSortable").sortable({ containment: ".imageSortable", scroll: false }); // Sorting all object in imageSortable 
	    }
	});
    });
/* -------------------------------------------------------------------------------------------------------- */
// Cabinet
count = 0;
    // Add selected images\ in the imageSortable
    $(".dragImages").live("click", function(){
	imageSrc = $(this).attr("src"); // Image Source
	imageID = $(this).attr("data-image-id"); // Image Id from the database
	$(this).remove(); // once user click the selected image they remove it from the list
	// Add the selected image to the imageSortable
	
	$(".imageSortable").append('<img data-position-counter="Image" src="'+imageSrc+'" id="image_'+imageID+'" data-image-id="'+imageID+'" width="217" class="saveCabinetDB imageProperties" style="margin-top: 5px; cursor: pointer;"/>');
	$(".imageConfigurable").children().remove(); // remove imageConfigurable
	a=0; // Reset counter of the action in imageProperties
	b=0; // Reset counter of the action in editImage
	$(".config").children().remove(); // remove config
	$(".imageProperties").each(function(){
	    $(".imageProperties").removeAttr("data-a-click"); // Remove attribute  of the selected images to make it not active
	});
	count++;
	
    });
    // Add spacer or the cable manager divider on every image
    c = 1;
    $(".imageSpacer").live("click", function(){
	$(".imageSortable").append('<div data-position-counter="Divider" class="saveCabinetDB spacerProperties" id="spacerProperties_'+c+'" data-counter-id="'+c+'" style="height: 20px; border: 1px solid #ddd;text-align: center; font-size: 8px;"><div style="margin-top:5px;">Cable Manager</div></div>');
	c++;
	count++;
    });
	// Delete divider
	$(".spacerProperties").live("click", function(){
	    counter = $(this).attr("data-counter-id");
	    con = "Do you want to delete this divider?";
	    if(confirm(con)){
		$("#spacerProperties_"+counter).remove();
	    }
	});
    
    $(".imageSortable").sortable({ containment: ".imageSortable", scroll: false }); // Sorting all object in imageSortable 
    
    // Show Action Config of the selected image
    a = 0;
    $(".imageProperties").live("click", function(){
	imageSrc = $(this).attr("src"); // Image Source
	imageID = $(this).attr("data-image-id"); // Image Id from the database
	if(a==0){
	    $(".imageConfigurable").append('<img src="/images/icon/edit.png" data-image-id="'+imageID+'" data-image-src="'+imageSrc+'" title="Edit" class="editImage cursor" style="margin-left:10px;margin-top:5px;"/>',
					   '<img src="/images/icon/delete.png" data-image-id="'+imageID+'" data-image-src="'+imageSrc+'" title="Remove" class="removeImage cursor" style="margin-left:10px;margin-top:5px;" />',
				       '<img src="/images/icon/stop.png" data-image-id="'+imageID+'" data-image-src="'+imageSrc+'" title="Cancel" class="cancelImage cursor" style="margin-left:10px;margin-top:5px;" />');
	    $(this).attr("data-a-click",a); // Add Attribute to the selected image to make it active
	}
	getA = $(this).attr("data-a-click");
	if(getA!=0){
	    //alert("Please click the icon cancel to allow you config this image.");
	    showNotification({
			message: "Please click the icon cancel to allow you config this image.",
			type: "warning",
			autoClose: true,
			duration: 5
		    });
	}
	a++;
	
	
    });
	// Edit CSS Property of the selected image
	b=0;
	$(".editImage").live("click", function(){
	    imageSrc = $(this).attr("data-image-src"); // Image Source
	    imageID = $(this).attr("data-image-id"); // Image Id from the database
	    // Add action / show edit function to the config div
	    if(b==0){
		$(".config").append('<input type="button" data-image-id="'+imageID+'" data-image-src="'+imageSrc+'" title="Half" value="Make it selected image Half" class="btn widthConfig" style="width:100%;"/>',
				    '<input type="button" data-image-id="'+imageID+'" data-image-src="'+imageSrc+'" title="Space" value="Space" class="btn spacerConfig" style="width:100%;" /><br />',
				    '<input type="button" data-image-id="'+imageID+'" data-image-src="'+imageSrc+'" title="Full width" value="Full width image" class="btn fullWidthConfig" style="width:100%;" />',
				    '<input type="button" data-image-id="'+imageID+'" data-image-src="'+imageSrc+'" title="Remove Space" value="Remove Space" class="btn removeSpacerConfig" style="width:100%;" />');
	    }
	    b++;
	});
	    // Adjust the width of the selected image
	    $(".widthConfig").live("click", function(){
		imageSrc = $(this).attr("data-image-src"); // Image Source
		imageID = $(this).attr("data-image-id"); // Image Id from the database
		$("#image_"+imageID).addClass("half");
		$("#image_"+imageID).removeClass("fullWidth");
	    });
	    // Adjust the space of the  selected image
	    $(".spacerConfig").live("click", function(){
		imageSrc = $(this).attr("data-image-src"); // Image Source
		imageID = $(this).attr("data-image-id"); // Image Id from the database
		$("#image_"+imageID).addClass("spacer");
		$("#image_"+imageID).removeClass("removeSpacer");
	    });
		// Adjust the width of the selected image
		$(".fullWidthConfig").live("click", function(){
		    imageSrc = $(this).attr("data-image-src"); // Image Source
		    imageID = $(this).attr("data-image-id"); // Image Id from the database
		    $("#image_"+imageID).addClass("fullWidth");
		    $("#image_"+imageID).removeClass("half");
		});
		// Adjust the space of the  selected image
		$(".removeSpacerConfig").live("click", function(){
		    imageSrc = $(this).attr("data-image-src"); // Image Source
		    imageID = $(this).attr("data-image-id"); // Image Id from the database
		    $("#image_"+imageID).addClass("removeSpacer");
		    $("#image_"+imageID).removeClass("spacer");
		});
	// Remove selected image from the dragImages
	$(".removeImage").live("click", function(){
	    imageSrc = $(this).attr("data-image-src"); // Image Source
	    imageID = $(this).attr("data-image-id"); // Image Id from the database
	    $("#image_"+imageID).remove(); // once user click the selected image they remove it from the list
	    a=0; // Reset counter of the action in imageProperties
	    $(".imageConfigurable").children().remove(); // remove imageConfigurable
	    // Add the selected image to the imageList
	    $(".imageList").append('<img src="'+imageSrc+'" data-image-id="'+imageID+'" width="217" class="dragImages" style="margin-top: 5px; cursor: pointer;"/>');
	    $(".config").children().remove(); // remove config
	    $("#image_"+imageID).removeAttr("data-a-click"); // Remove attribute  of the selected images to make it not active
	});
	
	$(".cancelImage").live("click", function(){
	    imageSrc = $(this).attr("data-image-src"); // Image Source
	    imageID = $(this).attr("data-image-id"); // Image Id from the database
	    $(".imageConfigurable").children().remove(); // remove imageConfigurable
	    a=0; // Reset counter of the action in imageProperties
	    b=0; // Reset counter of the action in editImage
	    $(".config").children().remove(); // remove config
	    $("#image_"+imageID).removeAttr("data-a-click"); // Remove attribute  of the selected images to make it not active
	});
    // Save Created Cabinet
    $(".saveCabinet").live("click", function(){
	cabinet = $(".imageSortable").html();
	update = $(".update").html();
	//console.log($(".imageSortable").html());
	action = "saveCabinet";
	
	cabinetName = $(this).attr("data-cabinet-name");
	$.ajax({
	    url:"/ajax/action",
	    type: "POST",
	    data:"action="+action + '&cabinet=' + cabinet + '&cabinetName=' + cabinetName + "&update=" + update,
	    success: function(e){
		showNotification({
		    message: "Created cabinet was successfully saved.",
		    type: "Success",
		    autoClose: true,
		    duration: 5
		});
	    }
	});
    });
/* -------------------------------------------------------------------------------------------------------- */
});

$(window).load(function(){
    $(".picLarge").css({
	"background-size":"680px"
    })
});
function effectFadeIn(classname) {
$("#"+classname).fadeOut(800).fadeIn(800, effectFadeOut(classname))
}
function effectFadeOut(classname) {
$("#"+classname).fadeIn(800).fadeOut(800, effectFadeIn(classname))
}



function chosenImageTag(fileID){
    $(".uploadedImage").each(function(){
	getFileID = $(this).attr("rel"); // File ID
	if(getFileID==fileID){
	    $(this).css("background-color","whitesmoke")
	}else{
	    $(this).css("background-color","white")
	}
    })
}

/* Set Active Nav */
function setActivNav(idOfNav){
    $(".navLink").each(function(){
        if(this.id==idOfNav){
            $("#"+idOfNav).addClass("active");
        }else{
            $("#"+this.id).removeClass("active");
        }
    })
}

//make the left and right an equal height
function equalDiv(){
    var leftHeight = $(".leftside").height();
    var rightHeight = $(".body_content").height();
    if (leftHeight >= rightHeight){ $(".rightside").height(leftHeight)}
    else{ $(".leftside").height(rightHeight)};
}


/* Set Auto Default to view the list of file tagged from the database */
action = "default";
//search dealers record from the database
page = 1;
// Tagged Info
$.post("/ajax/record", {action:action,page:page}, function(record){
        $(".Showsearch").html(record);
});
// User Maintenance
$.post("/ajax/userMaintenance", {action:action,page:page}, function(user){
        $("#load_user").html(user);
});

// Audit Trail
$.post("/ajax/audit_trail", {action:action,page:page}, function(auditTrail){
        $(".showAuditTrail").html(auditTrail);
});

//for pagination
$('.pagination li.active').live('click',function(){
    var page = $(this).attr('p');
    action = $(this).attr('data-tag-action');
    Name = $(this).attr("data-value");
	$.post("/ajax/record", {action:action,page:page,Name:Name}, function(record){
		$(".Showsearch").html(record);
	});
	
    // User Maintenance
    $.post("/ajax/userMaintenance", {action:action,page:page,Name:Name}, function(user){
	    $("#load_user").html(user);
    });
    
    // Audit Trail
    $.post("/ajax/audit_trail", {action:action,page:page,Name:Name}, function(auditTrail){
	    $(".showAuditTrail").html(auditTrail);
    });
    
});
